<div class="right">
    <div class="roleby-frame-header">
        <h3>已关联用户</h3>
    </div>
    <div class="table-header">
        <table class="table table-bordered  user-roleby-table">
            <thead>
                <tr >
                    <td class="wh50 text-center">
                        <!-- <input type="checkbox" (click)="selectAll()" [checked]="selectedItems?.length == rolebyRoleData?.length&&selectedItems?.length !=0"> -->
                        <input type="checkbox" #event (click)="selectAll(event.checked,rolebyRoleData)" [checked]="isSelectAll || removeTableService.getRemoveTableId?.length == rolebyRoleData?.length && removeTableService.getRemoveTableId?.length !=0" >
                    </td>
                    <td class=" text-center" >用户名</td>
                </tr>
            </thead>
        </table>
    </div>
    <div class="table-body wrapper">
        <table class="table table-bordered  user-roleby-table table-striped">
            <tbody *ngIf="rolebyRoleData" [dragula]='"another-bag"' [dragulaModel]='rolebyRoleData'>
                <tr *ngFor="let val of rolebyRoleData; let  i = index;" [ngClass]="{'active':i%2!=0}" (dblclick)="doublechange(val.userRoleId)">
                    <td class="wh50">
                        <!-- <input type="checkbox" (click)="sendSelectedItems(val.userRoleId)" [checked]="isSeleted(val.userRoleId)"> -->
                        <input type="checkbox" #event (click)="chose(event.checked, val.userRoleId, val.length)" [checked]="isChose">
                    </td>
                    <td class="text-center max-w" title="{{val.userName}}">{{val.userName}}</td>
                </tr>
            </tbody>
        </table>
    </div>
    <div class="info-bottom">
        <app-pagination [getTotalItems]="totalItems" (isLoadTableFromPagination)="isLoadTableFromPaginationHandler($event)"></app-pagination>
    </div>
    </div>